<template>
  <view class="create-interflow-box">
    <view class="create-top">
      <view class="top-avtor">
        <view class="top-bg" style="margin-right: 15px;">
          <image class="avtor-xj" mode="widthFix" src="@/static/interflow/bl-xj.png"></image>
          <image class="avtor-img" mode="widthFix" src="@/static/interflow/bl-pic.png"></image>
        </view>
        <view class="top-text"><text>版聊头像</text></view>
      </view>
      <view class="top-avtor">
        <view class="top-bg" style="margin-right: 15px;">
          <image class="avtor-xj" mode="widthFix" src="@/static/interflow/bl-xj.png"></image>
          <image class="avtor-img" mode="widthFix" src="@/static/interflow/bl-pic.png"></image>
        </view>
        <view class="top-text"><text>版聊背景</text></view>
      </view>
    </view>
    <view class="create-name">
      <u--input placeholder="请输入版聊名称" shape="circle" border="surround" clearable></u--input>
    </view>
    <view class="create-name">
      <u--textarea placeholder="请输入版聊简介"></u--textarea>
    </view>
    <u-button type="primary" shape="circle" text="确定"></u-button>
    <u-button shape="circle" text="取消"></u-button>
  </view>
</template>

<script>
  export default {
    components: {

    },
    data() {
      return {

      };
    },
    //下拉刷新
    onPullDownRefresh() {

    },
    created() {


    },

    onLoad() {
      uni.setNavigationBarTitle({
        title: '新建版聊'
      });

    },
    async onShow() {

    },
    async mounted() {

    },

    methods: {
      handleSearch() {

      },




    },
  };
</script>

<style lang="scss">
  .create-interflow-box {
    margin: 20px 30px 0 30px;

    .create-top {
      display: flex;

      .top-avtor {
        flex: 1;

        .top-text {
          margin-top: 10px;
          text-align: center;
        }

        .avtor-img {
          width: 60px;
        }
      }

      .top-bg {
        background: #e4e3e3;
        height: 260rpx;
        border-radius: 5px;
        box-shadow: 0rpx 3rpx 6rpx rgba(0, 46, 37, 0.08);
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;

        .avtor-xj {
          width: 30px;
          position: absolute;
          right: 10px;
          top: 10px;
        }
      }
    }

    .create-name {
      margin-top: 20px;
      margin-bottom: 20px;

      input {
        text-align: center !important;
      }

      .u-input {
        background: #f5f6f8;
      }

      .u-textarea {
        background: #f5f6f8;
      }
    }

    .u-button--info {
      margin-top: 20px;
    }
  }
</style>s